<template>
  <div>
    <div class="fillcontain" v-loading="dataListLoading">
      <bt-col-header title="公式因子"></bt-col-header>
      <div class="page-content">
        <el-form :model="dataForm" @keyup.enter.native="getDataList()" class="" label-width="120px">
          <el-form-item label="公式因子类型" class="col-md-4">
            <el-select v-model="dataForm.formulaType" filterable clearable placeholder="请选择">
              <el-option
                v-for="item in formulaType"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="公式因子代码" class="col-md-4">
            <el-input v-model="dataForm.formulaCode" placeholder="公式因子代码" clearable></el-input>
          </el-form-item>
          <el-form-item label="公式因子名称" class="col-md-4">
            <el-input v-model="dataForm.formulaName" placeholder="公式因子名称" clearable></el-input>
          </el-form-item>
          <div class="row contain-padding">
            <div class="col-md-12 text-center mt-2">
              <rich-button :plain="true" type="info" shape="capsule" icon='search' @click="getDataList()">查询</rich-button>
              <rich-button shape="capsule" icon='quit' @click="resetData">重置</rich-button>
            </div>
          </div>
        </el-form>

        <div class="">
          <!-- 操作按钮 -->
          <div class="btn-padding left">
            <el-button :plain="true" type="info" icon="circle-plus" @click="addOrUpdateHandle()">新增</el-button>
          </div>

          <!-- 查询结果列表 -->
          <div class="table_container">
            <!-- 列表 -->
            <el-table
              :data="dataList"
              border
              row-key="formulaCode"
              style="width: 100%; ">
              <el-table-column
                type="index"
                header-align="center"
                width="50"
                label="序号">
              </el-table-column>
              <el-table-column
                property="parentName"
                header-align="center"
                align="center"
                label="上级公式因子">
              </el-table-column>
              <el-table-column
                property="formulaType"
                header-align="center"
                align="center"
                label="公式因子类型">
                <template slot-scope="scope">
                  {{scope.row.formulaType | formulaTypeFilter}}
                </template>
              </el-table-column>
              <el-table-column
                property="formulaCode"
                header-align="center"
                align="center"
                label="公式因子代码">

              </el-table-column>
              <el-table-column
                property="formulaName"
                header-align="center"
                align="center"
                label="公式因子名称">
              </el-table-column>
              <el-table-column
                header-align="center"
                align="center"
                label="操作">
                <template slot-scope="scope">
                  <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row)">编辑</el-button>
                  <el-button type="text" size="small" @click="deleteHandle(scope.row.formulaId)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
              class="float-right mt-2"
              @size-change="sizeChangeHandle"
              @current-change="currentChangeHandle"
              :current-page="page.pageIndex"
              :page-sizes="[10, 20, 50, 100]"
              :page-size="page.pageSize"
              :total="page.totalPage"
              layout="total, sizes, prev, pager, next, jumper">
            </el-pagination>
          </div>
        </div>
      </div>
      
    </div>
  </div>
  
</template>

<script>
    import {formulaList,editFormula,deleteFormula} from '@/api/baseConfig/conditionDivisor'
    import constant from "@/api/constant";
    import { formulaTranslate } from '@/utils'

    export default {
        data() {
            return {
                formulaType: constant.ruleConfig.formulaType,
                dataForm: {
                    formulaCode: '',
                    formulaType: "",
                    formulaName: ''
                },
                dataList: [],
                dataListLoading: false,
                addOrUpdateVisible: false,
                page: {
                    pageIndex: 1,
                    pageSize: 10,
                    totalPage: 0
                }
            }
        },
        created() {
          this.getDataList()
        },
        components: {
        },
        methods: {
            edit(row){
                let data = row
                if(row.isEffect==='0'){
                    data.isEffect = '1'
                }else{
                    data.isEffect = '0'
                }
                this.$store.dispatch('loading/CHANGE_LOADING', true)
                editFormula(JSON.stringify(data)).then(res=>{
                    this.$store.dispatch('loading/CHANGE_LOADING', false)
                    this.getDataList()
                }).catch(err=>{
                    this.$store.dispatch('loading/CHANGE_LOADING', false)
                })
            },
            // 删除
            deleteHandle(id) {
                this.$confirm(`确定对[id=${id}]进行[删除]操作?`, '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let params = {
                        formulaId: id,
                        isEffect:'0'
                    }
                    deleteFormula(params).then(res => {
                        if (res.data && res.data.resultCode === 0) {
                            this.$message({
                                message: '操作成功',
                                type: 'success',
                                duration: 1500,
                                onClose: () => {
                                    this.getDataList()
                                }
                            })
                        } else {
                            this.$message.error(res.data.resultMsg)
                        }
                    })
                }).catch(() => {
                })
            },
            resetData() {
              this.dataForm= {
                    formulaCode: '',
                    formulaType: "",
                    formulaName: ''
                }
            },  
            // 每页数
            sizeChangeHandle(val) {
                this.page.pageSize = val
                this.page.pageIndex = 1
                this.getDataList()
            },
            // 当前页
            currentChangeHandle(val) {
                this.page.pageIndex = val
                this.getDataList()
            },
            // 获取数据列表
            getDataList() {
              let getData = {
                pageSize: 10,
                pageNumber: 1
              }
              let totalPage = 0
              this.$store.dispatch('loading/CHANGE_LOADING', true)
              formulaList(getData).then(res => {
                  this.$store.dispatch('loading/CHANGE_LOADING', false)
                  let data = formulaTranslate(res.data.data.records, 'formulaCode','parentCode')
                  console.log("res.data.data.records",res.data.data.records)
                  this.dataList = data
                  data.forEach(element => {
                    if(element.children == undefined) {
                      totalPage = totalPage + 1
                    }
                  });
                  this.page.totalPage = totalPage
              }).catch(err=>{
                  this.$store.dispatch('loading/CHANGE_LOADING', false)
              })
              console.log(this.dataList)
            },
            // 新增 / 修改
            addOrUpdateHandle(value) {
              constant.clearTag(this);
                // console.log(value);
                if(value){
                    this.$router.push({path: "/drools-baseConfig/formula/add-or-update/"+value.formulaId,query:{row:JSON.stringify(value)}})
                }else{
                    this.$router.push({path: "/drools-baseConfig/formula/add-or-update"})
                }

            },

        },
        filters:{
            formulaTypeFilter:function(value){
               return constant.getLabel(value, constant.ruleConfig.formulaType);
            },
            isEffectFilter:function(value){
                let label = ''
                if(value==='0'){
                    label = '失效'
                }else if(value==='1'){
                    label = "有效"
                }
                return label
            }
        }

    }
</script>
<style>
  body .el-table th.gutter {
    display: table-cell !important
  }
</style>
